<template>
  <div class="common-wrap">
    <div class="goodsDetails">
      <MyForm
        v-model:formData="formData"
        v-model:columns="formColumns"
        :rules="rules"
        :porpModel="true"
        labelWidth="120"
        :saveBtnLoading="saveBtnLoading"
        @submit="onSubmit"
      >
      </MyForm>
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from "vue";
import i18n from "@/lang/index.js";
import * as api from "@/api/index.js";
import { useRoute } from "vue-router";
import { ElMessage } from "element-plus";
const router = useRoute();
const formData = ref({
  oceanOrderGoodsDetails: [],
});
const formColumns = ref([
  {
    title: "货物明细",
    structure: [
      {
        title: "",
        type: "tabel",
        prop: "oceanOrderGoodsDetails",
        fixedParameter: {
          trackingNo: "trackingNo",
        },
        tableIndex: 0,
        height: 500,
        columns: [
          {
            type: "checkbox",
            width: 50,
            fixed: "left",
            align: "center",
          },
          {
            field: "trackingNo",
            title: "产品唛头",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "sku",
            title: "SKU",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "boxNo",
            title: "箱号",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "customsDeclare",
            title: "报关/退税",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "cargoName",
            title: "产品名称",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "cargoNameEn",
            title: "产品英文名",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "picUrl",
            title: "产品图片",
          },
          {
            field: "hsCode",
            title: "商品编码",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "brand",
            title: "产品品牌",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "brandType",
            title: "品牌类型",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "model",
            title: "型号",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "goodsNum",
            title: "产品总数",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "unitPrice",
            title: "单价",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "totalPrice",
            title: "总价",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "currencyCode",
            title: "币种",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "pcs",
            title: "件数",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
            },
          },
          {
            field: "cartonsPerPallet",
            title: "板内箱数",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
            },
          },
          {
            field: "totalGrossWeight",
            title: "总毛重",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "totalVolume",
            title: "总体积",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "useAge",
            title: "用途",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "useAgeEn",
            title: "用途(英文)",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "materialSpec",
            title: "材质/规格",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "materialSpecEn",
            title: "材质/规格(英文)",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "dutyRate",
            title: "关税税率",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "subProductName",
            title: "渠道名称",
          },
          {
            field: "warehouseName",
            title: "仓库名/地址名",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "deliveryAddress",
            title: "目的地送货地址",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "zipCode",
            title: "邮编",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "fbaShipmentId",
            title: "Shipment ID",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "referenceId",
            title: "Reference ID",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "productUrl",
            title: "产品链接",
          },
          {
            field: "insuranceType",
            title: "是否购买保险",
            formatter: ({ cellValue }) => {
              const obj = {
                0: i18n.global.t("无保险"),
                1: i18n.global.t("有保险"),
                2: i18n.global.t("公司"),
                3: i18n.global.t("自购"),
              };
              return obj[cellValue] || "";
            },
          },
          {
            field: "insuranceGoodsValue",
            title: "投保货值",
          },
          {
            field: "insuranceCurrency",
            title: "投保币别",
          },
          {
            field: "sales",
            title: "业务员",
            editRender: {},
            slots: { edit: "input_edit" },
          },
          {
            field: "grossWeight",
            title: "单箱毛重",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "length",
            title: "长(CM)",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "width",
            title: "宽(CM)",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "height",
            title: "高(CM)",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
          {
            field: "volume",
            title: "单箱体积",
            editRender: {},
            slots: { edit: "input_edit" },
            params: {
              type: "number",
              precision: 2,
            },
          },
        ],
        editRules: {
          boxNo: [
            {
              required: true,
              message: i18n.global.t("请填写箱号"),
            },
          ],
          customsDeclare: [
            {
              required: true,
              message: i18n.global.t("请填写报关/退税"),
            },
          ],
          cargoName: [
            {
              required: true,
              message: i18n.global.t("请填写产品名称"),
            },
          ],
          model: [
            {
              required: true,
              message: i18n.global.t("请填写型号"),
            },
          ],
          goodsNum: [
            {
              required: true,
              message: i18n.global.t("请填写产品总数"),
            },
          ],
          unitPrice: [
            {
              required: true,
              message: i18n.global.t("请填写单价"),
            },
          ],
          totalPrice: [
            {
              required: true,
              message: i18n.global.t("请填写总价"),
            },
          ],
          currencyCode: [
            {
              required: true,
              message: i18n.global.t("请填写币种"),
            },
          ],
          pcs: [
            {
              required: true,
              message: i18n.global.t("请填写件数"),
            },
          ],
          cartonsPerPallet: [
            {
              required: true,
              message: i18n.global.t("请填写板内箱数"),
            },
          ],
          totalGrossWeight: [
            {
              required: true,
              message: i18n.global.t("请填写总毛重"),
            },
          ],
          totalVolume: [
            {
              required: true,
              message: i18n.global.t("请填写总体积"),
            },
          ],
          useAge: [
            {
              required: true,
              message: i18n.global.t("请填写用途"),
            },
          ],
          fbaShipmentId: [
            {
              required: true,
              message: i18n.global.t("请填写Shipment ID"),
            },
          ],
          referenceId: [
            {
              required: true,
              message: i18n.global.t("请填写Reference ID"),
            },
          ],
          insuredValue: [
            {
              required: true,
              message: i18n.global.t("请填写投保货值"),
            },
          ],
        },
        multipleSelection: [],
        buttonType: ["add", "delete"],
        batchDelete: true,
        keepSource: true,
        changeEditNeedTrigger: false,
        keepSourceKey: "trackingNo",
        tableId: "trunkLineDetails",
      },
    ],
  },
]);
const rules = ref({});
const saveBtnLoading = ref(false);
onMounted(() => {
  if (router.query.detailed) {
    getInfo();
  }
});
const getInfo = () => {
  saveBtnLoading.value = true;
  api.default.order.maritimeAdministrationDetails
    .noPageList({
      trackingNo: router.query.detailed,
    })
    .then((res) => {
      formData.value = {
        trackingNo: router.query.detailed || "",
        oceanOrderGoodsDetails: res.data,
      };
    })
    .finally(() => {
      saveBtnLoading.value = false;
    });
};

const onSubmit = () => {
  saveBtnLoading.value = true;
  api.default.order.maritimeAdministrationDetails
    .edit(formData.value.oceanOrderGoodsDetails)
    .then((res) => {
      ElMessage.success(i18n.global.t("修改成功"));
      saveBtnLoading.value = false;
    })
    .catch(() => {
      saveBtnLoading.value = false;
    });
};
</script>

<style scoped lang="scss">
.goodsDetails {
  height: 100%;
}
</style>